<template>
	<view class="page-row" v-if="customer">
		<u-cell-group title="基本信息">
			<u-cell title="客户名称" :value="customer.name"></u-cell>
			<u-cell title="手机号" :value="customer.phone" >
				<u-tag slot="value" size="mini" :text="customer.phone" icon="phone" plain  @click="call(customer.phone)" ></u-tag>
			</u-cell>
			<u-cell title="跟进状态">
				<u-tag slot="value" size="mini" :text="statusMap[customer.status]" :type="statusTypeMap[customer.status]"></u-tag>
			</u-cell>
			<u-cell title="办理业务" :value="customer.type"></u-cell>
			<u-cell title="客户来源" :value="customer.source"></u-cell>
			<u-cell title="关联人" :value="customer.associated_users[0]['username'] || customer.associated_users[0]['nickname']"></u-cell>
			<u-cell title="创建时间" :value="formatDate(customer.create_date)"></u-cell>
		</u-cell-group>
	<!-- 	<u-cell-group title="个人信息" v-if="customer.id_card || customer.spouse">
			<u-cell title="身份证" :value="maskIdCard(customer.id_card)"></u-cell>
			<u-cell title="配偶" :value="customer.spouse || '-'"></u-cell>
		</u-cell-group>

		<u-cell-group title="企业信息" v-if="customer.company_info">
			<u-cell title="企业" :value="customer.company_info || '-'"></u-cell>
		</u-cell-group> -->

		<u-gap height="40" bgColor="#fff"></u-gap>
		<u-divider text="跟进记录"></u-divider>
		<!-- 跟进记录 -->
		<uni-card :title="record.content" :extra="'下次跟进'+record.next_time" :sub-title="formatDate(record.create_date)" v-for="record in followRecords"
			:key="record._id">
		</uni-card>
		<u-empty v-if="followRecords.length === 0"></u-empty>
		<u-gap height="40" bgColor="#fff"></u-gap>
		<button @click="addFollowRecord" size="mini" class="addFollow">新增跟进</button>
		<u-gap height="40" bgColor="#fff"></u-gap>
		<u-divider text="提醒记录"></u-divider>
		<!-- 提醒记录 -->
		<view>
			<u-empty v-if="reminds.length === 0"></u-empty>
			<view v-for="item in reminds" :key="item._id" class="remind-item">
				<u-cell :title="remindMap[item.type]" :value="item.trigger_time" isLink>
					<u-icon slot="icon" name="bell" size="32"></u-icon>
					<u-badge v-if="!item.is_completed" slot="right-icon" value="待提醒" type="error"></u-badge>
				</u-cell>
			</view>
			<u-gap height="40" bgColor="#fff"></u-gap>
			<button @click="addRemindRecord" size="mini" class="addFollow">新增提醒</button>
		</view>
	</view>
</template>

<script>
	const db = uniCloud.database();
	const Odb=uniCloud.importObject('mydb-customer')
	import {
		store,
		mutations
	} from '@/uni_modules/uni-id-pages/common/store.js'
	export default {
		data() {
			return {
				statusMap: {
					"potential": "潜在",
					"to_follow": "待跟进",
					"intention": "意向",
					"visit": "上门",
					"deal": "成交"
				},
				statusTypeMap: {
					"potential": "success",
					"to_follow": "info",
					"intention": "warning",
					"visit": "error",
					"deal": "error"
				},
				remindMap: {
					"follow": "跟进",
					"birthday": "客户生日",
					"repayment": "客户还款"
				},
				customer: null,
				followRecords: [],
				reminds: [],
				currentTab: 0,
				tabList: [{
						name: '跟进记录'
					},
					{
						name: '提醒事项'
					}
				]
			}
		},
		computed: {
			userInfo() {
				return store.userInfo
			},
			currentCustomer() {
				return store.currentCustomer
			}
		},
		async onLoad(e) {
			const customer = await Odb.getCustomerDetail(e.id)
			this.customer = customer.data
			this.loadFollowRecords()
			this.loadReminds()
		},
		methods: {
			// 格式化方法（同列表页）
			formatDate(val) {
				return uni.$u.timeFormat(val, 'yyyy-mm-dd');
			},
			maskIdCard(id) {
				if (!id) return ''
				return id.replace(/^(\d{6})\d+(\d{4})$/, '$1********$2')
			},

			formatSource(source) {
				const map = {
					online: '网络获客',
					channel: '渠道介绍',
					tel_sales: '电话销售',
					wechat: '微信营销',
					referral: '客户转介绍'
				}
				return map[source] || source
			},
			call(phoneNumber){
				uni.makePhoneCall({
					phoneNumber
				})
			},
			async loadFollowRecords() {
				const db = uniCloud.database()
				const res = await db.collection('mydb-follow-record')
					.where(`customer_id == '${this.customer._id}'`)
					.orderBy('create_time', 'desc')
					.get()
				this.followRecords = res.result.data
			},

			async loadReminds() {
				const db = uniCloud.database()
				const res = await db.collection('mydb-remind')
					.where(`customer_id == '${this.customer._id}'`)
					.orderBy('trigger_time', 'desc')
					.get()
				this.reminds = res.result.data
			},

			viewCreditReport() {
				const images = this.customer.company_info.credit_report || []
				uni.previewImage({
					urls: images.map(img => img.url),
					current: 0
				})
			},

			addFollowRecord() {
				uni.navigateTo({
					url: '/pages/follow/edit?customerId='+this.customer._id
				})
			},
			addRemindRecord() {
				uni.navigateTo({
					url: '/pages/remind/remind?customerId='+this.customer._id
				})
			},
			editCustomer() {
				uni.navigateTo({
					url: '/pages/customer/edit'
				})
			}
		}
	}
</script>

<style scoped>
	.page-row{
		padding-bottom: 20px;
	}
	.record-card {
		margin-bottom: 20rpx;
	}

	.record-method {
		margin-bottom: 10rpx;
	}

	.record-content {
		line-height: 1.6;
	}

	.remind-item {
		margin-bottom: 10rpx;
	}
	.addFollow{
		width: 100px;
		margin: 10px auto;
		display: block;
	}
</style>